<!-- @format -->

<template>
    <div class="container">
        <h1>{{ props.title }}</h1>
        <span>{{ props.subTitle }}</span>

        <section>
            <ul>
                <li v-for="item in props.list" :key="item.id">{{ item.title }}</li>
            </ul>
        </section>
    </div>
</template>
<script setup lang="ts">
interface IProps {
    title: string;
    subTitle?: string;
    list?: {title: string; id: number; path?: String}[];
}
const props = withDefaults(defineProps<IProps>(), {
    list: () => [{title: '占位占位占位', id: 1}],
});
</script>
<style scoped lang="scss">
.container {
    background-color: white;
    color: black;
}
</style>
